.img-main{
   display: flex;
   flex-direction: column;
   width: 100%;
   font-size: 18px;
   .top-img{
     width:  100%;
     display: flex;
     .img{
        width: 100%;
        img{
            width: 100%;
            height: 100%;
        }
     }
   }

   .imgPage{
      margin-top: .0625rem;
      display: flex;
      align-items: center;

      .imgShow{
        position: relative;
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        .frame{
            position: absolute;
            width:  calc(100% - 4px)  ;
            left:0;
            top:  0;
            height: calc(100% - 4px); 
            display: flex;
            border: 2px solid red;
        }
        img{
            width: calc(100% - 4px);
            height:  calc(100% - 4px);
        }
      }
      .swiper{
        height: 100%;
        width: 100%;
        // overflow-x: hidden !important;
        // overflow-y:hidden !important;
      }
      .change-icon{
          height: 100%;
          display: flex;
          align-items: center;
          justify-content: center;
        //   padding:  .05rem  0;
          background: #f6f6f6;
          .transform{
              transform: rotateZ(180deg);
          }
      }
      .slide{
        
      }
   }
}